import React from 'react'
import {
    Form,
    Input,
    Button,
    Toast

} from 'antd-mobile'


import {toLogin} from "../../api"
import { useNavigate } from 'react-router'
function Index() {
    const navigate=useNavigate()
    const onFinish=(value:any)=>{
        toLogin(value).then(res=>{
            console.log(res)
            const {mes,data,code}=res.data
            if(code===200){
                Toast.show({
                    content: mes,
                    position: 'top',
                })
                // 18、正确实现登录页面功能(登录态存储) 11：22
                localStorage.setItem('token',data)
                navigate('/home/main')
            }else{
                Toast.show({
                    content: mes,
                    position: 'top',
                })
            }
        })
    }
    return (
        <div>
            <Form
                layout='horizontal'
                onFinish={(value)=>onFinish(value)}
                footer={
                    <Button block type='submit' color='primary'>
                        登录
                    </Button>
                }
            >
                <Form.Item
                    name='username'
                    label='姓名'
                    rules={[{ required: true, message: '姓名不能为空' }]}
                >
                    <Input  placeholder='请输入姓名' />
                </Form.Item>
                <Form.Item
                    name='password'
                    label='密码'
                    rules={[{ required: true, message: '密码不能为空' }]}
                >
                    <Input  placeholder='请输入密码' />
                </Form.Item>
            </Form>
        </div>
    )
}

export default Index
